<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>固定定位</title>
		<style type="text/css">
			body {
				margin: 0;
			}
			.nav {
				width: 50%;
				height: 50px;
				background-color: #404040;
				position: fixed;
				right: 0;
				top:250px;
				/* z-index: -1; */
			}
			.main {
				margin: 0 auto;
				width: 80%;
				background-color: #E5E5E5;
				padding-bottom: 2000px;
				color: #FF6700;
			}
		</style>
	</head>
	<body>
		<!-- 固定定位
		 position:fixed
			定位以后，不随着网页滚动而变化位置，固定在页面上
			父元素定位不影响他
			定位以后脱离文档流，原来的位置丢失了
			定位基准 ：是浏览器的窗口左上角
			配合定位的四个属性 top bottom left right
			
		 -->
		 
		 <div class="nav"></div>
		 <div class="main">
			 Lorem ipsum dolor sit amet, consectetur adipisicing elit. Molestias est repudiandae dolore dolorem ab temporibus praesentium. Quisquam cumque ex asperiores soluta illo dolorum in beatae optio cupiditate vitae commodi doloribus.
		 </div>
	</body>
</html>
